<!DOCTYPE html>
<!-- saved from url=(0052)http://getbootstrap.com/docs/4.0/examples/dashboard/ -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>举报违规</title>
    <!-- Bootstrap core CSS -->
    <link href="asserts/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="asserts/css/dashboard.css" rel="stylesheet">

</head>

<body>
<div th:insert="common/bar::top"></div>

<div class="container-fluid">
    <div class="row">
        <div th:insert="common/bar::#left"></div>

        <main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
            <div class="table-responsive">
                <form id="superviseForm">
                    <div class="form-group">
                        <label>违规车辆牌照号码:</label>
                        <input name="ebickID" type="text" class="form-control" placeholder="">
                    </div>
                    <div class="form-group">
                        <label>违规类型:</label><br/>
                        <div class="form-check form-check-inline">
                            <input class="form-check-input" type="radio" name="superviseType" value="违规停车" checked>
                            <label class="form-check-label">违规停车</label>
                        </div>
                        <div class="form-check form-check-inline">
                            <input class="form-check‐input" type="radio" name="superviseType" value="乱拔他人充电电动车">
                            <label class="form-check-label">乱拔他人充电电动车</label>
                        </div>
                        <div class="form-check form-check-inline">
                            <input class="form-check‐input" type="radio" name="superviseType" value="违反基本交通规则">
                            <label class="form-check-label">违反基本交通规则</label>
                        </div>
                    </div>
                    <div class="form‐group">
                        <label>详情:</label>
                        <input type="text" name="details" class="form-control" placeholder="比如，事情的经过、地点等信息">
                    </div>
                    <br>
                    <div class="form-group">
                        <label>上传照片:</label><br>
                        <img id="show" src="" alt=""><br>
                        <input type="file" id="myfile" name="image"  onchange="showImage()">
                    </div>
                    <br>
                    <div class="form-group">
                        <label>操作类型:</label><br/>
                        <div class="form-check form-check-inline">
                            <input class="form-check-input" type="radio" name="operationType" value="提醒纠正" checked>
                            <label class="form-check-label">提醒纠正</label>
                        </div>
                        <div class="form-check form-check-inline">
                            <input class="form-check‐input" type="radio" name="operationType" value="举报上传">
                            <label class="form-check-label">举报上传</label>
                        </div>
                    </div>
                </form>
                    <button class="btn btn-primary" onclick="superviseFormSubmit()">添加</button>

            </div>
        </main>
    </div>
</div>
<script type="text/javascript" src="asserts/js/jquery-3.2.1.slim.min.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script src="asserts/js/popper.min.js"></script>
<script src="asserts/js/feather.min.js"></script>
<script src="asserts/js/bootstrap.min.js"></script>
<script type="text/javascript">
    //图片回显
    function showImage() {
        var reader = new FileReader();
        var file = document.getElementById("myfile").files[0];
        console.log(file);
        reader.onload=function (e) {
            ///console.log(this.result);
            document.getElementById('show').src=this.result;
        };
        reader.readAsDataURL(file);
    }


    function verifyLoginStatus() {
        //验证登录状态
        console.log("1");
        var message = document.getElementById("mystatus").innerText;
        console.log(message);
        if(message == '请先登录'){
            alert("请登录");
            location.href="login";
            return '1';
        }
        return '2';
    }

    //表单提交
    function superviseFormSubmit() {

        var status = verifyLoginStatus();

        if(status == '2'){
            var form = new FormData(document.getElementById("superviseForm"));

            $.ajax({
                url:"uploadSuperviseForm.do",
                type:"post",
                dataType:"html",
                data:form,
                cache:false,
                processData:false,
                contentType:false,
                success: function (data) {
                    console.log("success");
                    alert("举报成功! 等待验证");
                    //alert("登记成功！已生成驾驶证，点击查看。");
                    location.href="showMySupervise.do";

                },
                error:function (data) {
                    console.log("error");
                }
            })
        }

    }
    </script>
</body>

</html>